<template>
  <div class="role-dialog">
    <el-dialog :visible.sync="visible" destroy-on-close>
      <div class="panelWrap role-dialog-content">
        <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20">
          <div>{{ isEdit ? '修改系统角色' : '添加系统角色' }}</div>
          <i class="el-icon-close" @click="handleCloseDialog" />
        </div>

        <div class="role-content flex flexdc">
          <div class="m-b-10 m-t-20 flex role-header">
            <div class="checkbox flexdc flexcenter">
              <div v-for="(item, i) in sysList" :key="i">
                <div v-if="item.id === 1">
                  <div :class="`grow${item.id}  tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked1" :label="item.id" @change="handleCheckChange1">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked1" class="checkgou" @change="handleIsCheck1">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>基础数据菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree1"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree1"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[105]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree1"
                          @check="handleCheckChange(1)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" class="check" @change="handleCheckTree(1, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 2">
                  <div :class="`grow${item.id} tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked2" :label="item.id" @change="handleCheckChange2">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked2" class="checkgou" @change="handleIsCheck2">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>维保备案菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree2"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree2"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[1]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree2"
                          @check="handleCheckChange(2)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(2, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 3">
                  <div :class="`grow${item.id} tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked3" :label="item.id" @change="handleCheckChange3">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked3" class="checkgou" @change="handleIsCheck3">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>维保管理菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree3"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree3"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[107]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree3"
                          @check="handleCheckChange(3)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(3, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 4">
                  <div :class="`grow${item.id}  tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked4" :label="item.id" @change="handleCheckChange4">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked4" class="checkgou" @change="handleIsCheck4">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>凌波运营菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree4"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree4"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[106]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree4"
                          @check="handleCheckChange(4)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(4, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 5">
                  <div :class="`grow${item.id}  tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked5" :label="item.id" @change="handleCheckChange5">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked5" class="checkgou isChecked" @change="handleIsCheck5">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>政府管理菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree5"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree5"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[167]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree5"
                          @check="handleCheckChange(5)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(5, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 6">
                  <div :class="`grow${item.id}  tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked6" :label="item.id" @change="handleCheckChange6">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked6" class="checkgou" @change="handleIsCheck6">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>大数据菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree6"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree6"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[177]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree6"
                          @check="handleCheckChange(6)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(6, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 7">
                  <div :class="`grow${item.id}  tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked7" :label="item.id" @change="handleCheckChange7">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked7" class="checkgou" @change="handleIsCheck7">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>物联网菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree7"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree7"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[212]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree7"
                          @check="handleCheckChange(7)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(7, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 8">
                  <div :class="`grow${item.id}  tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked8" :label="item.id" @change="handleCheckChange8">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked8" class="checkgou" @change="handleIsCheck8">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>智慧小区菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree8"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree8"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[218]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree8"
                          @check="handleCheckChange(8)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(8, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>

                <div v-if="item.id === 9">
                  <div :class="`grow${item.id}  tree-grow m-t-10`">
                    <div class="flex">
                      <el-checkbox v-model="checked9" :label="item.id" @change="handleCheckChange9">{{ item.name }}</el-checkbox>
                      <el-checkbox v-model="isChecked9" class="checkgou" @change="handleIsCheck9">是否可用</el-checkbox>
                    </div>
                    <div class="panelWrap">
                      <div class="check-title flex fs14 cfff fwb pl p-r-20">
                        <div>电梯保险菜单权限</div>
                      </div>
                      <div class="sysTree">
                        <el-tree
                          ref="tree9"
                          class="left-tree coTree"
                          :current-node-key="0"
                          :data="setTree9"
                          :props="defaultProps"
                          :node-key="NODE_KEY"
                          :default-expanded-keys="[]"
                          :show-checkbox="true"
                          :highlight-current="true"
                          :default-checked-keys="checktree9"
                          @check="handleCheckChange(9)"
                        >
                          <span slot-scope="{ node, data }" class="custom-tree-node">
                            <span>{{ node.label }}</span>
                            <el-checkbox v-model="data.displayType" @change="handleCheckTree(9, data)">是否可用</el-checkbox>
                          </span>
                        </el-tree>
                      </div>
                    </div>
                  </div>
                </div>
              </div>

            </div>
            <div class="m-l-80 m-t-40 flex flexdc">
              <div class="roleName m-t-10">
                <span class="roleName-name m-l-20"><span class="mustval">*</span>角色名称：</span>
                <el-input v-model.trim="form.name" placeholder="请输入角色名称" class="roleName-input" />
              </div>
              <div class="roleName m-t-30">
                <span class="roleName-name m-l-20"><span class="mustval">*</span>机构名称：</span>
                <el-input v-model.trim="form.orgName" readonly placeholder="请选择机构" class="roleName-input" />
                <el-button type="warning" class="iconfont icon-xuanze m-l-20" @click="handleSelect">选择机构</el-button>
              </div>
              <div class="role-find flex flexac m-t-40">
                <span class="m-l-10">角色类型：</span>
                <el-radio-group v-model="form.type" class="find-radio">
                  <el-radio label="普通角色" />
                  <el-radio label="维保人员" />
                </el-radio-group>
              </div>
              <!-- <div class="role-find flex flexac m-t-40">
                <span class="m-l-10">权限类型：</span>
                <el-radio-group v-model="form.isDataRole" class="find-radio">
                  <el-radio label="功能权限" />
                  <el-radio label="数据权限" />
                </el-radio-group>
              </div> -->
              <div class="role-find flex flexac m-t-40">
                <span class="m-l-10">角色查看数据范围：</span>
                <el-radio-group v-model="form.range" class="find-radio">
                  <el-radio label="本人" />
                  <el-radio label="本机构" />
                  <el-radio label="本机构及其下级机构" />
                </el-radio-group>
              </div>
            </div>
          </div>
          <div class="footer-btn flex flexac flextc">
            <div>
              <el-button v-if="!isEdit" class="saveBtn btn m-r-20 el-icon-circle-check" @click="handleSave">保 存</el-button>
              <el-button v-else class="btn m-r-20 el-icon-circle-check" type="success" @click="handleEdit">更 新</el-button>
              <el-button class="btn m-t-30 el-icon-circle-close" type="warning" @click="handleCloseDialog">取 消</el-button>
            </div>
          </div>
        </div>
      </div>
    </el-dialog>

    <SelectOrg v-model="selectVisible" @update="handleSelectUpdate" />
  </div>

</template>

<script>

import { createRoleAdd, updateRole } from '@/api/baseInfo/authority/role'
import SelectOrg from '@/components/selectOrg/index'
import { findPlatforms } from '@/api/baseInfo/authority/resources'
// import { findSysList } from '@/api/baseInfo/authority/sys'
import { findMenuList } from '@/api/baseInfo/authority/menu'
import { showNotice, formatDateTime, transData } from '@/utils/toolclass'
import storage from '@/utils/storage'

export default {
  name: 'Role',
  components: { SelectOrg },
  props: {
    value: {
      type: Boolean,
      default: false
    },
    isEdit: {
      type: Boolean,
      default: false
    },
    datarole: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      checked1: false,
      checked2: false,
      checked3: false,
      checked4: false,
      checked5: false,
      checked6: false,
      checked7: false,
      checked8: false,
      checked9: false,
      isChecked1: false,
      isChecked2: false,
      isChecked3: false,
      isChecked4: false,
      isChecked5: false,
      isChecked6: false,
      isChecked7: false,
      isChecked8: false,
      isChecked9: false,
      sysRightList1: [],
      sysRightList2: [],
      sysRightList3: [],
      sysRightList4: [],
      sysRightList5: [],
      sysRightList6: [],
      sysRightList7: [],
      sysRightList8: [],
      sysRightList9: [],
      sysList: [],
      systemList: [],
      checked11: false,
      checked22: false,
      checked33: false,
      checked44: false,
      checked55: false,
      checked66: false,
      checked77: false,
      checked88: false,
      checked99: false,
      menuRightList: [],
      selectVisible: false,
      visible: false,
      checked: false,
      disTypeList: [],
      dataList: [],
      formOrigin: {
        crtOpr: '', // 创建人ID
        dataRightList: [], // 数据权限
        isDataRole: '功能权限', // 是否数据权限（0：否；1：是）
        lstEdtOpr: '', // 最后修改人ID
        orgId: '', // 机构ID
        orgName: '', // 机构名称
        type: '普通角色',
        range: '本机构及其下级机构', // 范围（1：本人；2：本级；3：本级及下级机构；）
        id: 0, // ID
        name: '', // 角色名称
        sysRightList: [], // 平台功能权限
        displayType: 1, // 显示类型（1：可用且可显示；2：可显示但不可用；）
        menuRightList: [], // 菜单功能权限
        buttonRightList: [
          {
            buttonId: 9999,
            buttonName: '',
            displayType: 1,
            menuId: ''
          }
        ], // 按钮功能权限
        buttonId: '', // 按钮ID
        buttonName: '', // 按钮名
        menuId: '', // 菜单ID
        menuName: '', // 菜单名
        parentId: '', // 父级ID（查询)
        sort: '', // 排序号
        url: '', // URL
        sysId: '', // 系统ID
        sysName: '', // 系统名
        version: 1 // 版本号
      },
      form: { ...this.datarole },
      setTree1: [], // tree数据
      setTree2: [], // tree数据
      setTree3: [], // tree数据
      setTree4: [], // tree数据
      setTree5: [], // tree数据
      setTree6: [], // tree数据
      setTree7: [], // tree数据
      setTree8: [], // tree数据
      setTree9: [], // tree数据
      checktree1: [],
      checktree2: [],
      checktree3: [],
      checktree4: [],
      checktree5: [],
      checktree6: [],
      checktree7: [],
      checktree8: [],
      checktree9: [],
      NODE_KEY: 'id', // id对应字段
      defaultProps: {// 默认设置
        children: 'children',
        label: 'name'
      },
      param: {
        id: '',
        name: '',
        pageIndex: 1,
        pageSize: 100
      },
      menu1: [],
      menu2: [],
      menu3: [],
      menu4: [],
      menu5: [],
      menu6: [],
      menu7: [],
      menu8: [],
      menu9: [],
      menus: [],
      sysMenu1: [],
      sysMenu2: [],
      sysMenu3: [],
      sysMenu4: [],
      sysMenu5: [],
      sysMenu6: [],
      sysMenu7: [],
      sysMenu8: [],
      sysMenu9: [],
      aaaa: []
    }
  },
  computed: {},
  watch: {
    visible(v) {
      this.$emit('input', v)
    },
    value(v) {
      this.visible = v
    },
    datarole(v) {
      console.log(v)
      if (v.id === 0) {
        this.form = { ...this.formOrigin }
      } else {
        this.form = { ...v }
        // 平台回显 --- 平台是否可用回显
        v.sysRightList.filter(item => {
          if (item.sysId === 1) {
            this.checked1 = true
            this.isChecked1 = item.displayType === 1
            return this.isChecked1
          }

          if (item.sysId === 2) {
            this.checked2 = true
            this.isChecked2 = item.displayType === 1
            return this.isChecked2
          }

          if (item.sysId === 3) {
            this.checked3 = true
            this.isChecked3 = item.displayType === 1
            return this.isChecked3
          }

          if (item.sysId === 4) {
            this.checked4 = true
            this.isChecked4 = item.displayType === 1
            return this.isChecked4
          }

          if (item.sysId === 5) {
            this.checked5 = true
            this.isChecked5 = item.displayType === 1
            return this.isChecked5
          }

          if (item.sysId === 6) {
            this.checked6 = true
            this.isChecked6 = item.displayType === 1
            return this.isChecked6
          }

          if (item.sysId === 7) {
            this.checked7 = true
            this.isChecked7 = item.displayType === 1
            return this.isChecked7
          }

          if (item.sysId === 8) {
            this.checked8 = true
            this.isChecked8 = item.displayType === 1
            return this.isChecked8
          }

          if (item.sysId === 9) {
            this.checked9 = true
            this.isChecked9 = item.displayType === 1
            return this.isChecked9
          }
        })

        // 菜单回显 --- 菜单是否可用回显
        const menu1 = v.sysRightList.filter(item => { if (item.sysId === 1) { return item } })
        // console.log(menu1)
        const m1 = menu1.length <= 0 ? [] : menu1[0].menuRightList.length <= 0 ? [] : menu1[0].menuRightList
        this.checktree1 = m1.length === this.sysMenu1.length ? m1.map(item => item.menuId) : m1.map(item => { if (item.menuId !== 105) { return item.menuId } })

        // console.log(m1)
        // console.log(this.sysMenu1)
        const sysName1 = this.sysMenu1.filter(item => { if (item.id === 105) { return item } })
        // console.log(sysName1)
        const newArr11 = m1.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName1[0].sysName,
            url: item.url,
            version: sysName1[0].version
          }
          return items
        })
        m1.map(item1 => {
          this.sysMenu1.map((item, i) => {
            if (item1.menuId === item.id) {
              return this.sysMenu1.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr1 = [...this.sysMenu1, ...newArr11]
        // console.log(newArr1)
        this.setTree1 = transData(newArr1, 'id', 'parentId')

        const menu2 = v.sysRightList.filter(item => { if (item.sysId === 2) { return item } })
        // console.log(menu2)
        const m2 = menu2.length <= 0 ? [] : menu2[0].menuRightList.length <= 0 ? [] : menu2[0].menuRightList
        this.checktree2 = m2.length === this.sysMenu2.length ? m2.map(item => item.menuId) : m2.map(item => { if (item.menuId !== 1) { return item.menuId } })

        const sysName2 = this.sysMenu2.filter(item => { if (item.id === 1) { return item } })
        // console.log(sysName1)
        const newArr22 = m2.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName2[0].sysName,
            url: item.url,
            version: sysName2[0].version
          }
          return items
        })
        m2.map(item2 => {
          this.sysMenu2.map((item, i) => {
            if (item2.menuId === item.id) {
              return this.sysMenu2.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr2 = [...this.sysMenu2, ...newArr22]
        // console.log(newArr1)
        this.setTree2 = transData(newArr2, 'id', 'parentId')

        const menu3 = v.sysRightList.filter(item => { if (item.sysId === 3) { return item } })
        const m3 = menu3.length <= 0 ? [] : menu3[0].menuRightList.length <= 0 ? [] : menu3[0].menuRightList
        this.checktree3 = m3.length === this.sysMenu3.length ? m3.map(item => item.menuId) : m3.map(item => { if (item.menuId !== 107) { return item.menuId } })

        const sysName3 = this.sysMenu3.filter(item => { if (item.id === 107) { return item } })
        // console.log(sysName1)
        const newArr33 = m3.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName3[0].sysName,
            url: item.url,
            version: sysName3[0].version
          }
          return items
        })
        m3.map(item3 => {
          this.sysMenu3.map((item, i) => {
            if (item3.menuId === item.id) {
              return this.sysMenu3.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr3 = [...this.sysMenu3, ...newArr33]
        // console.log(newArr3)
        this.setTree3 = transData(newArr3, 'id', 'parentId')

        const menu4 = v.sysRightList.filter(item => { if (item.sysId === 4) { return item } })
        // console.log(menu4)
        const m4 = menu4.length <= 0 ? [] : menu4[0].menuRightList.length <= 0 ? [] : menu4[0].menuRightList
        this.checktree4 = m4.length === this.sysMenu4.length ? m4.map(item => item.menuId) : m4.map(item => { if (item.menuId !== 106) { return item.menuId } })
        // console.log(this.checktree4)

        const sysName4 = this.sysMenu4.filter(item => { if (item.id === 106) { return item } })
        // console.log(sysName1)
        const newArr44 = m4.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName4[0].sysName,
            url: item.url,
            version: sysName4[0].version
          }
          return items
        })
        m4.map(item4 => {
          this.sysMenu4.map((item, i) => {
            if (item4.menuId === item.id) {
              return this.sysMenu4.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr4 = [...this.sysMenu4, ...newArr44]
        // console.log(newArr1)
        this.setTree4 = transData(newArr4, 'id', 'parentId')

        const menu5 = v.sysRightList.filter(item => { if (item.sysId === 5) { return item } })
        const m5 = menu5.length <= 0 ? [] : menu5[0].menuRightList.length <= 0 ? [] : menu5[0].menuRightList
        this.checktree5 = m5.length === this.sysMenu5.length ? m5.map(item => item.menuId) : m5.map(item => { if (item.menuId !== 167) { return item.menuId } })

        const sysName5 = this.sysMenu5.filter(item => { if (item.id === 167) { return item } })
        // console.log(sysName1)
        const newArr55 = m5.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName5[0].sysName,
            url: item.url,
            version: sysName5[0].version
          }
          return items
        })
        m5.map(item5 => {
          this.sysMenu5.map((item, i) => {
            if (item5.menuId === item.id) {
              return this.sysMenu5.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr5 = [...this.sysMenu5, ...newArr55]
        // console.log(newArr1)
        this.setTree5 = transData(newArr5, 'id', 'parentId')

        const menu6 = v.sysRightList.filter(item => { if (item.sysId === 6) { return item } })
        const m6 = menu6.length <= 0 ? [] : menu6[0].menuRightList.length <= 0 ? [] : menu6[0].menuRightList
        this.checktree6 = m6.length === this.sysMenu6.length ? m6.map(item => item.menuId) : m6.map(item => { if (item.menuId !== 177) { return item.menuId } })

        const sysName6 = this.sysMenu6.filter(item => { if (item.id === 177) { return item } })
        // console.log(sysName1)
        const newArr66 = m6.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName6[0].sysName,
            url: item.url,
            version: sysName6[0].version
          }
          return items
        })
        m6.map(item6 => {
          this.sysMenu6.map((item, i) => {
            if (item6.menuId === item.id) {
              return this.sysMenu6.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr6 = [...this.sysMenu6, ...newArr66]
        // console.log(newArr1)
        this.setTree6 = transData(newArr6, 'id', 'parentId')

        const menu7 = v.sysRightList.filter(item => { if (item.sysId === 7) { return item } })
        const m7 = menu7.length <= 0 ? [] : menu7[0].menuRightList.length <= 0 ? [] : menu7[0].menuRightList
        this.checktree7 = m7.length === this.sysMenu7.length ? m7.map(item => item.menuId) : m7.map(item => { if (item.menuId !== 212) { return item.menuId } })

        const sysName7 = this.sysMenu7.filter(item => { if (item.id === 212) { return item } })
        // console.log(sysName1)
        const newArr77 = m7.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName7[0].sysName,
            url: item.url,
            version: sysName7[0].version
          }
          return items
        })
        m7.map(item7 => {
          this.sysMenu7.map((item, i) => {
            if (item7.menuId === item.id) {
              return this.sysMenu7.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr7 = [...this.sysMenu7, ...newArr77]
        // console.log(newArr1)
        this.setTree7 = transData(newArr7, 'id', 'parentId')

        const menu8 = v.sysRightList.filter(item => { if (item.sysId === 8) { return item } })
        const m8 = menu8.length <= 0 ? [] : menu8[0].menuRightList.length <= 0 ? [] : menu8[0].menuRightList
        this.checktree8 = m8.length === this.sysMenu8.length ? m8.map(item => item.menuId) : m8.map(item => { if (item.menuId !== 218 && item.menuId !== 221) { return item.menuId } })

        const sysName8 = this.sysMenu8.filter(item => { if (item.id === 218) { return item } })
        // console.log(sysName1)
        const newArr88 = m8.map(item => {
          const items = {
            displayType: item.displayType === 1,
            id: item.menuId,
            name: item.menuName,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: sysName8[0].sysName,
            url: item.url,
            version: sysName8[0].version
          }
          return items
        })
        m8.map(item8 => {
          this.sysMenu8.map((item, i) => {
            if (item8.menuId === item.id) {
              return this.sysMenu8.splice(i, 1)
            }
          })
        })

        // console.log(newArr11)
        // console.log(this.sysMenu1)
        const newArr8 = [...this.sysMenu8, ...newArr88]
        // console.log(newArr1)
        this.setTree8 = transData(newArr8, 'id', 'parentId')

        const menu9 = v.sysRightList.filter(item => { if (item.sysId === 9) { return item } })
        const m9 = menu9.length <= 0 ? [] : menu9[0].menuRightList.length <= 0 ? [] : menu9[0].menuRightList
        this.checktree9 = m9.length === this.sysMenu9.length ? m9.map(item => item.menuId) : []
      }
    }
  },
  created() {
    this.userInfo = JSON.parse(storage.get('userInfo'))
    this.getSystemList()
    this.handleGetSysMenu()
  },
  methods: {
    // 添加
    handleSave() {
      // console.log(this.form.sysRightList)
      this.form.sysRightList = [...this.sysRightList1, ...this.sysRightList2, ...this.sysRightList3, ...this.sysRightList4, ...this.sysRightList5, ...this.sysRightList6, ...this.sysRightList7, ...this.sysRightList8, ...this.sysRightList9]
      // if (!(/^\S+$/.test(this.form.name))) {
      //   showNotice('error', '提示', '请输入角色名称')
      //   return
      // }
      // if (!(/^\S+$/.test(this.form.orgName))) {
      //   showNotice('error', '提示', '请选择机构')
      //   return
      // }

      const params = {
        crtOpr: this.form.crtOpr === '' ? this.userInfo.userId : this.form.crtOpr,
        dataRightList: [
          {
            orgId: this.form.orgId,
            orgName: this.form.orgName,
            range: this.form.range === '本人' ? 1 : this.form.range === '本机构' ? 2 : 3
          }
        ],
        id: this.form.id,
        isDataRole: this.form.isDataRole === '功能权限' ? 0 : 1,
        lstEdtOpr: this.isEdit === false ? null : this.form.lstEdtOpr === null ? this.userInfo.userId : this.form.lstEdtOpr,
        name: this.form.name,
        type: this.form.type === '普通角色' ? 1 : 2,
        sysRightList: this.form.sysRightList,
        version: this.form.version ? this.form.version : 1
      }
      // console.log(this.form.sysRightList)
      console.log(params)
      // this.handleCreateAdd(params)
    },
    handleCreateAdd(data) {
      createRoleAdd(data).then(res => {
        if (res.code === '000000') {
          showNotice('success', '提示', '添加成功!')
          this.$emit('handleRefresh')
          this.$emit('handleCloseDialog')
        } else {
          if (res.msg === '失败') {
            showNotice('error', '提示', '添加失败')
          } else {
            showNotice('error', '提示', res.msg)
          }
        }
      })
    },
    // 编辑
    handleEdit() {
      // console.log(this.form)
      console.log(this.form.sysRightList)
      const sysRightList = [...this.sysRightList1, ...this.sysRightList2, ...this.sysRightList3, ...this.sysRightList4, ...this.sysRightList5, ...this.sysRightList6, ...this.sysRightList7, ...this.sysRightList8, ...this.sysRightList9]
      this.form.sysRightList = [...this.form.sysRightList, ...sysRightList]
      // if (!(/^\S+$/.test(this.form.name))) {
      //   showNotice('error', '提示', '请输入角色名称')
      //   return
      // }
      // if (!(/^\S+$/.test(this.form.orgName))) {
      //   showNotice('error', '提示', '请选择机构')
      //   return
      // }

      const params = {
        crtOpr: this.form.crtOpr === '' ? this.userInfo.userId : this.form.crtOpr,
        dataRightList: [
          {
            orgId: this.form.orgId,
            orgName: this.form.orgName,
            range: this.form.range === '本人' ? 1 : this.form.range === '本机构' ? 2 : 3
          }
        ],
        id: this.form.id,
        isDataRole: this.form.isDataRole === '功能权限' ? 0 : 1,
        lstEdtOpr: this.isEdit === false ? null : this.form.lstEdtOpr === null ? this.userInfo.userId : this.form.lstEdtOpr,
        name: this.form.name,
        type: this.form.type === '普通角色' ? 1 : 2,
        sysRightList: this.form.sysRightList,
        version: this.form.version ? this.form.version : 1
      }
      console.log(params)
      // this.handleUpdate(params)
    },
    handleUpdate(data) {
      updateRole(data).then(res => {
        if (res.code === '000000') {
          showNotice('success', '提示', '修改成功!')
          this.$emit('handleRefresh')
          this.$emit('handleCloseDialog')
        } else {
          if (res.msg === '失败') {
            showNotice('error', '提示', '修改失败')
          } else {
            showNotice('error', '提示', res.msg)
          }
        }
      })
    },

    handleCheckChange1(v) {
      if (v === false) {
        this.$refs.tree1[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree11.map(item => item.id)
        this.$refs.tree1[0].setCheckedKeys(newArr)
        const menu111 = this.$refs.tree1[0].getCheckedNodes().concat(this.$refs.tree1[0].getHalfCheckedNodes())
        // console.log(menu111)
        // console.log(this.isChecked1)
        var menuRightList1 = menu111.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system1 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 1) {
            return item
          }
        })

        this.sysRightList1 = [{
          displayType: this.isChecked1 === true ? 1 : 2,
          menuRightList: menuRightList1,
          sysId: system1[0].id,
          sysName: system1[0].name
        }]
        // console.log(this.sysRightList1)
        // console.log(this.isChecked1)
      }
    },
    handleIsCheck1(v) {
      // console.log(v)
      this.isChecked1 = v
      if (v === false) {
        const settree1 = this.setTree11.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree1 = transData(settree1, 'id', 'parentId')
      } else {
        const settree1 = this.setTree11.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree1 = transData(settree1, 'id', 'parentId')
      }
      const isMenu1 = this.$refs.tree1[0].getCheckedNodes().concat(this.$refs.tree1[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList1 = isMenu1.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system1 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 1) {
          return item
        }
      })

      this.sysRightList1 = [{
        displayType: this.isChecked1 === true ? 1 : 2,
        menuRightList: menuRightList1,
        sysId: system1[0].id,
        sysName: system1[0].name
      }]
      // console.log(this.sysRightList1)
      // console.log(this.isChecked1)
    },

    handleCheckChange2(v) {
      if (v === false) {
        this.$refs.tree2[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree22.map(item => item.id)
        this.$refs.tree2[0].setCheckedKeys(newArr)
        const menu222 = this.$refs.tree2[0].getCheckedNodes().concat(this.$refs.tree2[0].getHalfCheckedNodes())

        var menuRightList2 = menu222.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system2 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 2) {
            return item
          }
        })

        this.sysRightList2 = [{
          displayType: this.isChecked2 === true ? 1 : 2,
          menuRightList: menuRightList2,
          sysId: system2[0].id,
          sysName: system2[0].name
        }]
      }
    },
    handleIsCheck2(v) {
      this.isChecked2 = v
      if (v === false) {
        const settree2 = this.setTree22.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree2 = transData(settree2, 'id', 'parentId')
      } else {
        const settree2 = this.setTree22.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree2 = transData(settree2, 'id', 'parentId')
      }
      const isMenu2 = this.$refs.tree2[0].getCheckedNodes().concat(this.$refs.tree2[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList2 = isMenu2.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system2 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 2) {
          return item
        }
      })

      this.sysRightList2 = [{
        displayType: this.isChecked2 === true ? 1 : 2,
        menuRightList: menuRightList2,
        sysId: system2[0].id,
        sysName: system2[0].name
      }]
    },

    handleCheckChange3(v) {
      if (v === false) {
        this.$refs.tree3[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree33.map(item => item.id)
        this.$refs.tree3[0].setCheckedKeys(newArr)
        const menu333 = this.$refs.tree3[0].getCheckedNodes().concat(this.$refs.tree3[0].getHalfCheckedNodes())
        var menuRightList3 = menu333.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system3 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 3) {
            return item
          }
        })

        this.sysRightList3 = [{
          displayType: this.isChecked3 === true ? 1 : 2,
          menuRightList: menuRightList3,
          sysId: system3[0].id,
          sysName: system3[0].name
        }]
      }
    },
    handleIsCheck3(v) {
      this.isChecked3 = v
      if (v === false) {
        const settree3 = this.setTree33.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree3 = transData(settree3, 'id', 'parentId')
      } else {
        const settree3 = this.setTree33.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree3 = transData(settree3, 'id', 'parentId')
      }
      const isMenu3 = this.$refs.tree3[0].getCheckedNodes().concat(this.$refs.tree3[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList3 = isMenu3.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system3 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 3) {
          return item
        }
      })

      this.sysRightList3 = [{
        displayType: this.isChecked3 === true ? 1 : 2,
        menuRightList: menuRightList3,
        sysId: system3[0].id,
        sysName: system3[0].name
      }]
    },

    handleCheckChange4(v) {
      if (v === false) {
        this.$refs.tree4[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree44.map(item => item.id)
        this.$refs.tree4[0].setCheckedKeys(newArr)
        const menu444 = this.$refs.tree4[0].getCheckedNodes().concat(this.$refs.tree4[0].getHalfCheckedNodes())

        var menuRightList4 = menu444.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system4 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 4) {
            return item
          }
        })

        this.sysRightList4 = [{
          displayType: this.isChecked4 === true ? 1 : 2,
          menuRightList: menuRightList4,
          sysId: system4[0].id,
          sysName: system4[0].name
        }]
      }
    },
    handleIsCheck4(v) {
      this.isChecked4 = v
      if (v === false) {
        const settree4 = this.setTree44.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree4 = transData(settree4, 'id', 'parentId')
      } else {
        const settree4 = this.setTree44.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree4 = transData(settree4, 'id', 'parentId')
      }
      const isMenu4 = this.$refs.tree4[0].getCheckedNodes().concat(this.$refs.tree4[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList4 = isMenu4.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system4 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 4) {
          return item
        }
      })

      this.sysRightList4 = [{
        displayType: this.isChecked4 === true ? 1 : 2,
        menuRightList: menuRightList4,
        sysId: system4[0].id,
        sysName: system4[0].name
      }]
    },

    handleCheckChange5(v) {
      if (v === false) {
        this.$refs.tree5[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree55.map(item => item.id)
        this.$refs.tree5[0].setCheckedKeys(newArr)
        const menu555 = this.$refs.tree5[0].getCheckedNodes().concat(this.$refs.tree5[0].getHalfCheckedNodes())

        var menuRightList5 = menu555.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system5 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 5) {
            return item
          }
        })

        this.sysRightList5 = [{
          displayType: this.isChecked5 === true ? 1 : 2,
          menuRightList: menuRightList5,
          sysId: system5[0].id,
          sysName: system5[0].name
        }]
      }
    },
    handleIsCheck5(v) {
      this.isChecked5 = v
      if (v === false) {
        const settree5 = this.setTree55.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree5 = transData(settree5, 'id', 'parentId')
      } else {
        const settree5 = this.setTree55.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree5 = transData(settree5, 'id', 'parentId')
      }
      const isMenu5 = this.$refs.tree5[0].getCheckedNodes().concat(this.$refs.tree5[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList5 = isMenu5.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system5 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 5) {
          return item
        }
      })

      this.sysRightList5 = [{
        displayType: this.isChecked5 === true ? 1 : 2,
        menuRightList: menuRightList5,
        sysId: system5[0].id,
        sysName: system5[0].name
      }]
    },

    handleCheckChange6(v) {
      if (v === false) {
        this.$refs.tree6[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree66.map(item => item.id)
        this.$refs.tree6[0].setCheckedKeys(newArr)
        const menu666 = this.$refs.tree6[0].getCheckedNodes().concat(this.$refs.tree6[0].getHalfCheckedNodes())

        var menuRightList6 = menu666.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system6 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 6) {
            return item
          }
        })

        this.sysRightList6 = [{
          displayType: this.isChecked6 === true ? 1 : 2,
          menuRightList: menuRightList6,
          sysId: system6[0].id,
          sysName: system6[0].name
        }]
      }
    },
    handleIsCheck6(v) {
      this.isChecked6 = v
      if (v === false) {
        const settree6 = this.setTree66.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree6 = transData(settree6, 'id', 'parentId')
      } else {
        const settree6 = this.setTree66.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree6 = transData(settree6, 'id', 'parentId')
      }
      const isMenu6 = this.$refs.tree6[0].getCheckedNodes().concat(this.$refs.tree6[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList6 = isMenu6.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system6 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 6) {
          return item
        }
      })

      this.sysRightList6 = [{
        displayType: this.isChecked6 === true ? 1 : 2,
        menuRightList: menuRightList6,
        sysId: system6[0].id,
        sysName: system6[0].name
      }]
    },

    handleCheckChange7(v) {
      if (v === false) {
        this.$refs.tree7[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree77.map(item => item.id)
        this.$refs.tree7[0].setCheckedKeys(newArr)
        const menu777 = this.$refs.tree7[0].getCheckedNodes().concat(this.$refs.tree7[0].getHalfCheckedNodes())

        var menuRightList7 = menu777.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system7 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 7) {
            return item
          }
        })

        this.sysRightList7 = [{
          displayType: this.isChecked7 === true ? 1 : 2,
          menuRightList: menuRightList7,
          sysId: system7[0].id,
          sysName: system7[0].name
        }]
      }
    },
    handleIsCheck7(v) {
      this.isChecked7 = v
      if (v === false) {
        const settree7 = this.setTree77.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree7 = transData(settree7, 'id', 'parentId')
      } else {
        const settree7 = this.setTree77.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree7 = transData(settree7, 'id', 'parentId')
      }
      const isMenu7 = this.$refs.tree7[0].getCheckedNodes().concat(this.$refs.tree7[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList7 = isMenu7.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system7 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 7) {
          return item
        }
      })

      this.sysRightList7 = [{
        displayType: this.isChecked7 === true ? 1 : 2,
        menuRightList: menuRightList7,
        sysId: system7[0].id,
        sysName: system7[0].name
      }]
    },

    handleCheckChange8(v) {
      this.isChecked8 = v
      if (v === false) {
        this.$refs.tree8[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree88.map(item => item.id)
        this.$refs.tree8[0].setCheckedKeys(newArr)
        const menu888 = this.$refs.tree8[0].getCheckedNodes().concat(this.$refs.tree8[0].getHalfCheckedNodes())

        var menuRightList8 = menu888.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system8 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 8) {
            return item
          }
        })

        this.sysRightList8 = [{
          displayType: this.isChecked8 === true ? 1 : 2,
          menuRightList: menuRightList8,
          sysId: system8[0].id,
          sysName: system8[0].name
        }]
      }
    },
    handleIsCheck8(v) {
      if (v === false) {
        const settree8 = this.setTree88.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree8 = transData(settree8, 'id', 'parentId')
      } else {
        const settree8 = this.setTree88.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree8 = transData(settree8, 'id', 'parentId')
      }
      const isMenu8 = this.$refs.tree8[0].getCheckedNodes().concat(this.$refs.tree8[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList8 = isMenu8.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system8 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 8) {
          return item
        }
      })

      this.sysRightList1 = [{
        displayType: this.isChecked8 === true ? 1 : 2,
        menuRightList: menuRightList8,
        sysId: system8[0].id,
        sysName: system8[0].name
      }]
    },

    handleCheckChange9(v) {
      if (v === false) {
        this.$refs.tree9[0].setCheckedKeys([])
      } else {
        var newArr = this.setTree99.map(item => item.id)
        this.$refs.tree9[0].setCheckedKeys(newArr)
        const menu999 = this.$refs.tree9[0].getCheckedNodes().concat(this.$refs.tree9[0].getHalfCheckedNodes())

        var menuRightList9 = menu999.map(item => {
          const items = {
            displayType: item.displayType === null ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system9 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === 9) {
            return item
          }
        })

        this.sysRightList9 = [{
          displayType: this.isChecked9 === true ? 1 : 2,
          menuRightList: menuRightList9,
          sysId: system9[0].id,
          sysName: system9[0].name
        }]
      }
    },
    handleIsCheck9(v) {
      this.isChecked9 = v
      if (v === false) {
        const settree9 = this.setTree99.map(item => {
          const items = {
            displayType: false,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree9 = transData(settree9, 'id', 'parentId')
      } else {
        const settree9 = this.setTree99.map(item => {
          const items = {
            displayType: true,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        this.setTree9 = transData(settree9, 'id', 'parentId')
      }
      const isMenu9 = this.$refs.tree9[0].getCheckedNodes().concat(this.$refs.tree9[0].getHalfCheckedNodes())
      // console.log(menu111)
      var menuRightList9 = isMenu9.map(item => {
        const items = {
          displayType: v === true ? 1 : 2,
          id: item.id,
          name: item.name,
          parentId: item.parentId,
          sort: item.sort,
          sysId: item.sysId,
          sysName: item.sysName,
          url: item.url,
          version: item.version
        }
        return items
      })
      var system9 = this.sysList.filter(item => {
        // console.log(item)
        if (item.id === 9) {
          return item
        }
      })

      this.sysRightList9 = [{
        displayType: this.isChecked9 === true ? 1 : 2,
        menuRightList: menuRightList9,
        sysId: system9[0].id,
        sysName: system9[0].name
      }]
    },

    handleCheckChange(id) {
      // console.log(id)
      // console.log(this.isChecked1)
      if (id === 1) {
        const tree1 = this.$refs.tree1[0].getCheckedNodes().concat(this.$refs.tree1[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList1 = tree1.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system1 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList1 = [{
          displayType: this.isChecked1 === true ? 1 : 2,
          menuRightList: menuRightList1,
          sysId: system1[0].id,
          sysName: system1[0].name
        }]
      }

      if (id === 2) {
        const tree2 = this.$refs.tree2[0].getCheckedNodes().concat(this.$refs.tree2[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList2 = tree2.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system2 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList2 = [{
          displayType: this.isChecked2 === true ? 1 : 2,
          menuRightList: menuRightList2,
          sysId: system2[0].id,
          sysName: system2[0].name
        }]
      }

      if (id === 3) {
        const tree3 = this.$refs.tree3[0].getCheckedNodes().concat(this.$refs.tree3[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList3 = tree3.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system3 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList3 = [{
          displayType: this.isChecked3 === true ? 1 : 2,
          menuRightList: menuRightList3,
          sysId: system3[0].id,
          sysName: system3[0].name
        }]
      }

      if (id === 4) {
        const tree4 = this.$refs.tree4[0].getCheckedNodes().concat(this.$refs.tree4[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList4 = tree4.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system4 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList4 = [{
          displayType: this.isChecked4 === true ? 1 : 2,
          menuRightList: menuRightList4,
          sysId: system4[0].id,
          sysName: system4[0].name
        }]
      }

      if (id === 5) {
        const tree5 = this.$refs.tree5[0].getCheckedNodes().concat(this.$refs.tree5[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList5 = tree5.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system5 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList5 = [{
          displayType: this.isChecked5 === true ? 1 : 2,
          menuRightList: menuRightList5,
          sysId: system5[0].id,
          sysName: system5[0].name
        }]
      }

      if (id === 6) {
        const tree6 = this.$refs.tree6[0].getCheckedNodes().concat(this.$refs.tree6[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList6 = tree6.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system6 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList6 = [{
          displayType: this.isChecked6 === true ? 1 : 2,
          menuRightList: menuRightList6,
          sysId: system6[0].id,
          sysName: system6[0].name
        }]
      }

      if (id === 7) {
        const tree7 = this.$refs.tree7[0].getCheckedNodes().concat(this.$refs.tree7[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList7 = tree7.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system7 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList7 = [{
          displayType: this.isChecked7 === true ? 1 : 2,
          menuRightList: menuRightList7,
          sysId: system7[0].id,
          sysName: system7[0].name
        }]
      }

      if (id === 8) {
        const tree8 = this.$refs.tree8[0].getCheckedNodes().concat(this.$refs.tree8[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList8 = tree8.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system8 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList8 = [{
          displayType: this.isChecked8 === true ? 1 : 2,
          menuRightList: menuRightList8,
          sysId: system8[0].id,
          sysName: system8[0].name
        }]
      }

      if (id === 9) {
        const tree9 = this.$refs.tree9[0].getCheckedNodes().concat(this.$refs.tree9[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList9 = tree9.map(item => {
          const items = {
            displayType: item.displayType === undefined ? 2 : item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        var system9 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList9 = [{
          displayType: this.isChecked9 === true ? 1 : 2,
          menuRightList: menuRightList9,
          sysId: system9[0].id,
          sysName: system9[0].name
        }]
      }
      this.form.sysRightList = [...this.sysRightList1, ...this.sysRightList2, ...this.sysRightList3, ...this.sysRightList4, ...this.sysRightList5, ...this.sysRightList6, ...this.sysRightList7, ...this.sysRightList8, ...this.sysRightList9]
    },

    handleCheckTree(id, v) {
      // console.log(v)
      // this.disTypeList = [...this.disTypeList, ...[v]]
      // console.log(this.disTypeList)
      if (id === 1) {
        const tree1 = this.$refs.tree1[0].getCheckedNodes().concat(this.$refs.tree1[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList1 = tree1.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system1 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList1 = [{
          displayType: this.isChecked1 === true ? 1 : 2,
          menuRightList: menuRightList1,
          sysId: system1[0].id,
          sysName: system1[0].name
        }]
      }

      if (id === 2) {
        const tree2 = this.$refs.tree2[0].getCheckedNodes().concat(this.$refs.tree2[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList2 = tree2.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system2 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList2 = [{
          displayType: this.isChecked2 === true ? 1 : 2,
          menuRightList: menuRightList2,
          sysId: system2[0].id,
          sysName: system2[0].name
        }]
      }

      if (id === 3) {
        const tree3 = this.$refs.tree3[0].getCheckedNodes().concat(this.$refs.tree3[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList3 = tree3.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system3 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList3 = [{
          displayType: this.isChecked3 === true ? 1 : 2,
          menuRightList: menuRightList3,
          sysId: system3[0].id,
          sysName: system3[0].name
        }]
      }

      if (id === 4) {
        const tree4 = this.$refs.tree4[0].getCheckedNodes().concat(this.$refs.tree4[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList4 = tree4.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system4 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList4 = [{
          displayType: this.isChecked4 === true ? 1 : 2,
          menuRightList: menuRightList4,
          sysId: system4[0].id,
          sysName: system4[0].name
        }]
      }

      if (id === 5) {
        const tree5 = this.$refs.tree5[0].getCheckedNodes().concat(this.$refs.tree5[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList5 = tree5.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system5 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList5 = [{
          displayType: this.isChecked5 === true ? 1 : 2,
          menuRightList: menuRightList5,
          sysId: system5[0].id,
          sysName: system5[0].name
        }]
      }

      if (id === 6) {
        const tree6 = this.$refs.tree6[0].getCheckedNodes().concat(this.$refs.tree6[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList6 = tree6.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system6 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList6 = [{
          displayType: this.isChecked6 === true ? 1 : 2,
          menuRightList: menuRightList6,
          sysId: system6[0].id,
          sysName: system6[0].name
        }]
      }

      if (id === 7) {
        const tree7 = this.$refs.tree7[0].getCheckedNodes().concat(this.$refs.tree7[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList7 = tree7.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system7 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList7 = [{
          displayType: this.isChecked7 === true ? 1 : 2,
          menuRightList: menuRightList7,
          sysId: system7[0].id,
          sysName: system7[0].name
        }]
      }

      if (id === 8) {
        const tree8 = this.$refs.tree8[0].getCheckedNodes().concat(this.$refs.tree8[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList8 = tree8.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system8 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList8 = [{
          displayType: this.isChecked8 === true ? 1 : 2,
          menuRightList: menuRightList8,
          sysId: system8[0].id,
          sysName: system8[0].name
        }]
      }

      if (id === 9) {
        const tree9 = this.$refs.tree9[0].getCheckedNodes().concat(this.$refs.tree9[0].getHalfCheckedNodes())
        // console.log(tree1)
        var menuRightList9 = tree9.map(item => {
          const items = {
            displayType: item.displayType === true ? 1 : 2,
            id: item.id,
            name: item.name,
            parentId: item.parentId,
            sort: item.sort,
            sysId: item.sysId,
            sysName: item.sysName,
            url: item.url,
            version: item.version
          }
          return items
        })
        // console.log(id)
        var system9 = this.sysList.filter(item => {
          // console.log(item)
          if (item.id === id) {
            return item
          }
        })

        this.sysRightList9 = [{
          displayType: this.isChecked9 === true ? 1 : 2,
          menuRightList: menuRightList9,
          sysId: system9[0].id,
          sysName: system9[0].name
        }]
      }
      this.form.sysRightList = [...this.sysRightList1, ...this.sysRightList2, ...this.sysRightList3, ...this.sysRightList4, ...this.sysRightList5, ...this.sysRightList6, ...this.sysRightList7, ...this.sysRightList8, ...this.sysRightList9]
    },
    // 查询所有机构弹窗
    handleSelect() {
      this.selectVisible = true
    },
    // 机构信息更新回调
    handleSelectUpdate(row) {
      // console.log(row)
      this.form.orgName = row.name
      this.form.orgId = row.id
    },
    // 获取平台列表
    getSystemList() {
      findPlatforms().then(res => {
      // findSysList('', '', 1, 10).then(res => {
        if (res.code === '000000') {
          // console.log(res)
          // this.displayTypes = res.data.map(item => item.id)
          // this.systemList = res.data.map(item => item.id)
          this.sysList = res.data
        }
        // console.log(this.sysList)
      })
    },
    // 获取公司能够使用的系统下的所有权限
    handleGetSysMenu() {
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 1).then(res => {
        if (res.code === '000000') {
          // console.log('sysList1', res.data)
          this.sysMenu1 = res.data
          this.setTree11 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // console.log('sysList1', this.setTree11)
          // this.checked1 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree1 = transData(list, 'id', 'parentId')
          this.setTree1 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 2).then(res => {
        if (res.code === '000000') {
          // console.log('sysList2', res.data)
          this.sysMenu2 = res.data
          this.setTree22 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked2 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree2 = transData(list, 'id', 'parentId')
          this.setTree2 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 3).then(res => {
        if (res.code === '000000') {
          // console.log('sysList3', res.data)
          this.sysMenu3 = res.data
          this.setTree33 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked3 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree3 = transData(list, 'id', 'parentId')
          this.setTree3 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 4).then(res => {
        if (res.code === '000000') {
          // console.log('sysList4', res.data)
          this.sysMenu4 = res.data
          this.setTree44 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked4 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree4 = transData(list, 'id', 'parentId')
          this.setTree4 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 5).then(res => {
        if (res.code === '000000') {
          // console.log('sysList5', res.data)
          this.sysMenu5 = res.data
          this.setTree55 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked5 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree5 = transData(list, 'id', 'parentId')
          this.setTree5 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 6).then(res => {
        if (res.code === '000000') {
          // console.log('sysList6', res.data)
          this.sysMenu6 = res.data
          this.setTree66 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked6 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree6 = transData(list, 'id', 'parentId')
          this.setTree6 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 7).then(res => {
        if (res.code === '000000') {
          // console.log('sysList7', res.data)
          this.sysMenu7 = res.data
          this.setTree77 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked7 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree7 = transData(list, 'id', 'parentId')
          this.setTree7 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 8).then(res => {
        if (res.code === '000000') {
          // console.log('sysList8', res.data)
          this.sysMenu8 = res.data
          this.setTree88 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked8 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree8 = transData(list, 'id', 'parentId')
          this.setTree8 = transData(res.data, 'id', 'parentId')
        }
      })
      findMenuList(this.param.id, this.param.name, this.param.pageIndex, this.param.pageSize, 9).then(res => {
        if (res.code === '000000') {
          // console.log('sysList9', res.data)
          this.sysMenu9 = res.data
          this.setTree99 = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? 1 : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.checked9 = res.data.map(item => item.id)
          const list = res.data.map(item => {
            const items = {
              displayType: item.displayType === null ? true : item.displayType,
              id: item.id,
              name: item.name,
              parentId: item.parentId,
              sort: item.sort,
              sysId: item.sysId,
              sysName: item.sysName,
              url: item.url,
              version: item.version
            }
            return items
          })
          // this.setTree9 = transData(list, 'id', 'parentId')
          this.setTree9 = transData(res.data, 'id', 'parentId')
        }
      })
    },
    handleCloseDialog() {
      this.$emit('handleCloseDialog')
    },

    handleExportExcel() {
      require.ensure([], () => {
        const { export_json_to_excel } = require('@/excel/Export2Excel')
        const tHeader = ['系统ID', '资源图标', '父资源', '资源ID', '资源名称', '资源顺序', '资源类型', '资源链接']
        const filterVal = ['sysId', 'iconUrl', 'parentId', 'resourceId', 'orgName', 'resourceSort', 'resourceType', 'resourceUrl']
        const data = this.formatJson(filterVal, this.dataList)
        export_json_to_excel(tHeader, data, '系统平台权限资源表(' + formatDateTime().ymd) + ')'
      })
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    }
  }
}
</script>

<style lang="scss">
@import "@/styles/public.scss";
.role-dialog {
  .role-dialog-content {
    width: 1400px;
    height: 900px;
    margin: 0 0 0 -200px;
    background: #ffffff;
    .role-content {
      .role-header {
        flex: 1;
        .checkbox {
          width: 900px;
          min-height: 660px;
          .checkgou {
            position: absolute;
            top: 0;
            right: 10px;
            .el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner {
              background-color: #3cb371;
              border-color: #3cb371;
            }
            .el-checkbox__input.is-checked+.el-checkbox__label {
              color: #3cb371;
            }
          }

          .custom-tree-node {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 14px;
            padding-right: 8px;
            .el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner {
              background-color: #3cb371;
              border-color: #3cb371;
            }
            .el-checkbox__input.is-checked+.el-checkbox__label {
              color: #3cb371;
            }
          }
          .grow1 {
            position: absolute;
            top: 86px;
            left: -32px;
            right: 0;
          }
          .grow2 {
            position: absolute;
            top: 86px;
            left: 238px;
            right: 0;
          }
          .grow3 {
            position: absolute;
            top: 86px;
            left: 508px;
            right: 0;
          }
          .grow4 {
            position: absolute;
            top: 326px;
            left: -32px;
            right: 0;
          }
          .grow5 {
            position: absolute;
            top: 326px;
            left: 238px;
            right: 0;
          }
          .grow6 {
            position: absolute;
            top: 326px;
            left: 508px;
            right: 0;
          }
          .grow7 {
            position: absolute;
            top: 564px;
            left: -32px;
            right: 0;
          }
          .grow8 {
            position: absolute;
            top: 564px;
            left: 238px;
            right: 0;
          }
          .grow9 {
            position: absolute;
            top: 564px;
            left: 508px;
            right: 0;
          }
          .tree-grow {
            max-width: 260px;
            height: 200px;
            // margin-left: -24px;
            margin-left: -124px;
            .check-title {
              line-height: 34px;
              background: #3cb371;
              font-size: 12px;
            }
            .sysTree {
              height: 160px;
              overflow: auto;
              .coTree {
                // overflow: auto;
                height: 160px;
                .el-tree-node .el-checkbox .el-checkbox__inner {
                  display: block !important;
                }
              }
            }
          }
        }
        .role-select {
          margin-left: -280px;
        }
        .roleName {
          margin-left: -130px;
        }
        .role-admin {
          margin-left: -104px;
        }
        .role-org {
          .com-select {
            width: 100px;
            height: 40px;
          }
        }
        .role-find {
          margin-left: -114px;
        }
      }
      .footer-btn {
        height: 180px;
      }
    }
  }
}
</style>
